<template>
  <tr>
    <td class="agent">{{one.agentName}}</td>
    <td>{{one.agentNo}}</td>
    <td v-for="(item, index) in monitorHeader" v-show="item.show === true" :key="index">{{one[item.name]}}</td>
  </tr>
</template>
<script>
  export default {
    name: 'trAgentIm',
    data () {
      return {
        activeName: 'table'
      }
    },
    props: {
      one: {type: Object, default: function () { return {} }},
      monitorHeader: {type: Array, default: function () { return [] }}
    },
    methods: {
    },
    beforeMount () {
    }
  }
</script>
<style lang="stylus" scoped>
  @import '../../../assets/common.styl';
  .agent
    max-width 120px
    text-overflow ellipsis
    overflow hidden
    white-space nowrap
  .button-group
    display none
    position: absolute
    top: -20px
    right 35px
    z-index 1
    background-color $cf-white
    text-align center
    padding 0 10px
    border 1px solid #eee
  .operate
    position relative
    &:hover
      .button-group
        display: block
</style>
